<template>
  <div class="gather-item">
    <el-form class="left">
      <el-form-item label="检波器">
        <el-select v-model="form.detector">
          <el-option
            v-for="item in checkWaveItems"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="文件名前缀">
        <el-input v-model="form.fileNamePrefix" />
      </el-form-item>
      <el-form-item v-if="type !== 'channel'" :label="pickTypeLabel">
        <el-input v-model="form.extractValue">
          <template #suffix>
            {{ unit }}
          </template>
        </el-input>
      </el-form-item>
      <el-form-item v-if="type === 'channel'" label="中心频率">
        <el-input>
          <template #append>
            <el-select>
              <el-option v-for="item in rateUnitItems" :key="item">{{ item }}</el-option>
            </el-select>
          </template>
        </el-input>
      </el-form-item>
      <el-form-item v-if="type === 'channel'" label="信号带宽">
        <el-input>
          <template #append>
            <el-select>
              <el-option v-for="item in rateUnitItems" :key="item">{{ item }}</el-option>
            </el-select>
          </template>
        </el-input>
      </el-form-item>
      <el-form-item v-if="type === 'channel'" label="输出功率">
        <el-select>
          <el-option
            v-for="item in powerItems"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          />
        </el-select>
      </el-form-item>
    </el-form>
    <ul class="right">
      <li v-for="item in gatherStatus" :key="item.label" class="info-list">
        <span class="label">{{ item.label }}</span>
        <span class="value">{{ item.value }}</span>
      </li>
      <li class="mt-6">
        <el-button class="ctl-btn mr-4">开始</el-button>
        <el-button class="ctl-btn close" @click="stopGather">结束</el-button>
      </li>
    </ul>
  </div>
</template>

<script setup>
import useScanStore from '@/store/modules/scanMonitor'
const scanStore = useScanStore()

const checkWaveItems = [
  { label: '平均', value: 0 },
  { label: '最大保持', value: 1 }
]
const rateUnitItems = ['Hz', 'KHz', 'MHz', 'GHz']
const powerItems = [{
  value: 'dBm',
  label: 'dBm(信道功率)'
},
{
  value: 'dBm/Hz',
  label: 'dBm/Hz(功率谱密度)'
}]
const gatherStatus = [
  { label: '进度', value: '已保存' },
  { label: '记录次数', value: '10次' },
  { label: '文件大小', value: '20.32MB' },
]
const props = defineProps({
  type: {
    type: String,
    default: 'time'
  }
})

const unit = computed(() => props.type === 'time' ? '秒' : '次')
const pickTypeLabel = computed(() => props.type === 'time' ? '抽取时间' : '抽取次数')
const form = ref({
  detector: 0,
  fileNamePrefix: 0,
  extractValue: 0,
})
const stopGather = () => {
  console.log(1111)
}

watchEffect(() => {
  if (scanStore.dataStatus == 1) {
    stopGather()
  }
})
</script>